<script setup>
import FirstLevelHeading from '@/components/title/FirstLevelHeading.vue'

const props = defineProps({
  title: {
    type: String,
    default: '默认标题'
  }
})
</script>

<template>
  <div class="first-level-card flex flex-col">
    <div class="h-43.5 w-507">
      <FirstLevelHeading :title="props.title"></FirstLevelHeading>
    </div>
    <div class="flex-1 p-20">
      <slot></slot>
    </div>

  </div>

</template>

<style scoped>
.first-level-card {
  height: 100%;
  width: 100%;
  background: linear-gradient(360deg, rgba(13, 32, 38, 0.3) 0%, #0D2026 48%, rgba(13, 32, 38, 0.5) 100%);
  border-radius: 0px 0px 0px 0px;
  border: 1px solid;
  border-image: linear-gradient(180deg, rgba(60, 129, 152, 0), rgba(60, 129, 152, 1), rgba(60, 129, 152, 0.3)) 1 1;
}
</style>
